﻿@{
    ViewBag.Title = "Management";
    Layout = "~/Views/Shared/ListLayout.cshtml";
}
<!--layout-->
<div id="cc" class="easyui-layout" data-options="fit:true,border:false">
    <div data-options="region:'west',split:true,title:'组织机构'" style="width: 222px;">
        <ul class="easyui-tree" id="ttOrg" data-options="url:'@Url.Action("GetAllOrganizationsForTree","Organization")',parentField: 'ParentId'"></ul>
    </div>
    <div data-options="region:'center',border:false">
        <table id="dg" class="easyui-datagrid" data-options="title:'用户列表',fitColumns:true,pagination:true,fit:true,url:'@Url.Action("GetPagedList")',sortName:'UserName',toolbar:'#tb',onClickRow: onClickRow">
            <thead>
                <tr>
                    <th data-options="field:'Id',checkbox:true"></th>
                    <th data-options="field:'UserName',width:80,sortable:true,sortField:'UserName'">登录帐户</th>
                    <th data-options="field:'FullName',width:100,sortable:true">姓名</th>
                    <th data-options="field:'Birthday',width:80,sortable:true,align:'right',formatter:common.dateFormatter">出生日期</th>
                    <th data-options="field:'OrganizationId',width:80,align:'right',formatter:formatOrgName,sortable:true,sortField:'Auth_Organization.Name'">组织</th>
                </tr>
            </thead>
        </table>
    </div>
    <div data-options="region:'east',split:true,title:'分配角色'" style="width: 222px;">
        <div>
            <a href="#" class="easyui-linkbutton" iconcls="icon-save" plain="true" onclick="distributeRole()">分配</a>
            <a href="#" class="easyui-linkbutton" iconcls="icon-remove" plain="true" onclick="resetRole()">清空</a>
        </div>
        <ul class="easyui-tree" id="ttRole" data-options="url:'@Url.Action("GetAllRolesForTree", "Role")',checkbox:true,"></ul>
    </div>
</div>
<!--/layout-->
<!--dialog-->
<div id="dlgAdd" class="easyui-dialog" title="添加用户" style="width:520px;height:200px;padding:10px"
     data-options="
                closed:true,
                iconCls: 'icon-save',
                toolbar: [{
                    text:'清空',
                    iconCls:'icon-reload',
                    handler:function(){
                        $('#fm').form('clear');
                    }
                },{
                    text:'保存',
                    iconCls:'icon-save',
                    handler:onclickSave
                },'-',{
                    text:'连续保存',
                    iconCls:'icon-save',
                    handler:function(){
                        alert('save')
                    }
                }]
            ">
    <div class="willow-form">
        <fieldset>
            <form id="fm" class="easyui-form" method="post">
                <table class="table4column">
                    <tr>
                        <th>
                            登录账号：
                        </th>
                        <td>
                            <input type="text" id="UserName" name="UserName" class="easyui-validatebox" data-options="required:true" />
                        </td>
                        <th>
                            密码：
                        </th>
                        <td>
                            <input type="text" id="Password" name="Password" class="easyui-validatebox" data-options="required:true,validType:'length[1,20]',tipPosition:'bottom'" />
                        </td>
                    </tr>
                    <tr>
                        <th>
                            姓名：
                        </th>
                        <td>
                            <input type="text" id="FullName" name="FullName" class="easyui-validatebox" data-options="required:true" />
                        </td>
                        <th>
                            性别：
                        </th>
                        <td>
                            <select id="Gender" name="Gender" class="easyui-combobox" data-options="required:true" style="width:150px">
                                <option value="1">男</option>
                                <option value="2">女</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <th>
                            出生日期：
                        </th>
                        <td>
                            <input class="easyui-datebox" id="Birthday" name="Birthday" data-options="formatter:common.dateFormatter" />
                        </td>
                        <th>
                            组织：
                        </th>
                        <td>
                            <select id="OrganizationId" name="OrganizationId" class="easyui-combotree" style="width:150px" data-options="url:'@Url.Action("GetAllOrganizationsForTree","Organization")',parentField: 'ParentId'"></select>
                        </td>
                    </tr>
                </table>
                <input type="hidden" id="Id" name="Id" />
            </form>
        </fieldset>
    </div>
</div>
<!--/dialog-->
<!--advancedSearch-->
<div id="searchdialog" class="easyui-searchdialog" title="高级查询" style="width:520px;height:400px" data-options="
                closed:true,
                iconCls: 'icon-search',
                toolbar: [{
                    text:'清空',
                    iconCls:'icon-reload',
                    handler:function(){
                        var data = advancedData.clone();
                        $('#searchdialog').searchdialog('loadData', data);
                    }
                },{
                    text:'查询',
                    iconCls:'icon-search',
                    handler:advancedSearch
                }]
            ">

</div>
<!--/advancedSearch-->
<!--toolbar-->
<div id="tb">
    <div class="datagrid-toolbar-toolField">
        <div style="width: 70%; float: left">
            @*<a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true" onclick="onclickAdd()">添加</a>
                <a href="#" class="easyui-linkbutton" iconcls="icon-edit" plain="true" onclick="onclickEdit()">编辑</a>
                <a href="#" class="easyui-linkbutton" iconcls="icon-remove" plain="true" onclick="onclickDelete()">删除</a>
                <span class="separator"></span>
                <a href="#" class="easyui-linkbutton" iconcls="icon-search" plain="true" onclick="dgSearch()">查询</a>
                <a href="#" class="easyui-linkbutton" iconcls="icon-page_white_word" plain="true" onclick="exportWord()">导出</a>*@
            @Html.Action("RenderToolbar", "Common", new { area = "" })
            <a href="#" class="easyui-menubutton" data-options="menu:'#mm1',iconCls:'icon-export'">导出</a>
            <div id="mm1" style="width:150px;">
                <div data-options="iconCls:'icon-page_white_word'" onclick="exportWord()">Word</div>
                <div data-options="iconCls:'icon-page_white_excel'" onclick="exportExcel()">Excel</div>
            </div>
        </div>
        <div style="width: 30%; float: left;text-align:right">
            <a id="btnCollapse" href="#" class="easyui-linkbutton" iconcls="icon-collapse" plain="true"></a>
        </div>
    </div>
    <div id="pnlSearch" class="datagrid-toolbar-searchField">
        <form id="formSearch">
            登录帐户:<input type="text" id="serhUserName" name="serhUserName" placeholder="登录帐户" data-query="method:'Contains',name:'UserName'" />
            姓名:<input type="text" id="serhFullName" name="serhFullName" data-query="method:'Contains',name:['FullName','Spell'],orGroup:'name'" placeholder="姓名" />
        </form>
    </div>
</div>
<!--/toolbar-->
@section Script{
    <script src="~/Scripts/jquery-easyui/src/jquery.datagrid.js"></script>
    <script src="~/Scripts/jquery-easyui/src/jquery.datebox.js"></script>
    <script src="~/Scripts/jquery-easyui/extensions/jquery.searchdialog.js"></script>
    <script>

        var advancedData = [{
            field: 'UserName',
            title: '登录帐户',
            method: 'Equal',
            editor: { type: 'text' }
        }, {
            field: 'FullName',
            title: '姓名 ',
            method: 'Equal',
            editor: { type: 'text' }
        }, {
            field: 'OrganizationId',
            title: '组织机构 ',
            method: 'Equal',
            editor: { type: 'combotree', options: { url: '@Url.Action("GetAllOrganizationsForTree","Organization")', parentField: 'ParentId' } }
        }];

        $(function () {
            $('#btnCollapse').click(function () {
                $('#pnlSearch').toggle();
                $('#dg').datagrid('resize');
                var $collapse = $(this).find('.l-btn-text span:first');
                if ($collapse.hasClass('icon-collapse')) {
                    $collapse.removeClass('icon-collapse').addClass('icon-expand');
                } else {
                    $collapse.removeClass('icon-expand').addClass('icon-collapse');
                }
            });

            $('#ttOrg').tree({ onSelect: dgSearch });
        });

        //格式化组织机构名称
        function formatOrgName(value, row, index) {
            return row.OrganizationName;
        }

        //导出word文件
        function exportWord() {
            var selectedRow = $('#dg').datagrid('getSelected');
            if (!selectedRow) {
                top.showAlert('请选择信息!', 'warning');
                return false;
            }
            location.href = '@Url.Action("ExportWord")?userId=' + selectedRow.Id;
        }

        //导出excel文件
        function exportExcel() {
            var selectedOrg = $('#ttOrg').tree('getSelected');
            var queryParams = $('#formSearch').form('getQueryParams');
            queryParams['sort'] = $('#dg').datagrid('options').sortName;
            queryParams['order'] = $('#dg').datagrid('options').sortOrder;
            if (selectedOrg) {
                queryParams['OrgId'] = selectedOrg.id;
            }
            var filter = $.param(queryParams);
            location.href = '@Url.Action("ExportExcel")?' + filter;
        }

        /*点击删除*/
        function onclickDelete() {
            var checkedRow = $('#dg').datagrid('getChecked');
            if (checkedRow.length == 0) {
                top.showAlert('请选择信息!', 'warning');
                return false;
            }
            var ids = [];
            for (var i = 0; i < checkedRow.length; i++) {
                ids.push(checkedRow[i].Id);
            }

            $.messager.confirm('信息提示', '确定删除吗?', function (r) {
                if (r) {
                    var url = '@Url.Action("Delete")';
                    var postData = ids;
                    common.post(url, postData, function (result) {
                        if (result) {
                            $("#dg").datagrid('reload');
                        }
                    });
                }
            });

        }

        /*点击添加*/
        function onclickAdd() {
            $('#fm').form('clear');
            $('#dlgAdd').dialog('open');
        }

        /*点击编辑*/
        function onclickEdit() {
            var selectedRow = $('#dg').datagrid('getSelected');
            if (!selectedRow) {
                top.showAlert('请选择信息!', 'warning');
                return false;
            }
            selectedRow = selectedRow.clone()
            //selectedRow.Birthday = common.dateFormatter(selectedRow.Birthday);
            $('#fm').form('clear');
            $('#fm').form('load', selectedRow);
            $('#dlgAdd').dialog('open');
        }

        /*点击保存*/
        function onclickSave() {
            var isValid = $('#fm').form('validate');
            if (!isValid) {
                return false;
            }

            var postData = $('#fm').form('getData');
            var url = '@Url.Action("Save")';
            common.post(url, postData, function (result) {
                if (result) {
                    $("#dg").datagrid('reload');
                    $('#dlgAdd').dialog('close');
                }
            });
        }

        /*查询*/
        function dgSearch() {
            var selectedOrg = $('#ttOrg').tree('getSelected');
            var orgId = selectedOrg == null ? null : selectedOrg.id;

            var queryParams = $('#formSearch').form('getQueryParams');
            queryParams['OrgId'] = orgId;
            $('#dg').datagrid({
                queryParams: queryParams
            });
        }

        /*单击行*/
        function onClickRow(rowIndex, rowData) {
            var url = '@Url.Action("GetRelatedRole")';
            var data = { userId: rowData.Id };
            $.get(url, data, function (data) {
                var $ttRole = $('#ttRole');
                resetRole();
                for (var i = 0; i < data.length; i++) {
                    var moduleId = data[i];
                    var node = $ttRole.tree('find', moduleId);
                    $ttRole.tree('check', node.target);
                }
            })
        }

        /*分配角色*/
        function distributeRole() {
            var selectedRole = $('#dg').datagrid('getSelected');
            if (!selectedRole) {
                top.showAlert('请选择用户!', 'warning');
                return false;
            }

            var nodes = $('#ttRole').tree('getChecked');
            var roleIds = [];
            for (var i = 0; i < nodes.length; i++) {
                roleIds.push(nodes[i].id);
            }

            var url = '@Url.Action("DistributeRole","Role")';
            var postData = {
                userId: selectedRole.Id,
                roleIds: roleIds
            }
            common.post(url, postData);
        }

        //清空角色
        function resetRole() {
            var $ttRole = $('#ttRole');
            var nodes = $ttRole.tree('getChecked');
            for (var i = 0; i < nodes.length; i++) {
                var curNode = nodes[i];
                $ttRole.tree('uncheck', curNode.target);
            }
        }

        //打开高级查询
        function dgAdvancedSearch() {
            var data = advancedData.clone();
            $('#searchdialog').searchdialog().searchdialog('loadData', data).searchdialog('open');
        }

        //高级查询
        function advancedSearch() {
            var queryParams = $('#searchdialog').searchdialog('getQueryParams');
            var selectedOrg = $('#ttOrg').tree('getSelected');
            var orgId = selectedOrg == null ? null : selectedOrg.id;
            queryParams['OrgId'] = orgId;

            $('#dg').datagrid({
                queryParams: queryParams
            });
        }

    </script>
}



